<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
          content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <title></title>
    <script src="../js/Cesium/1.65/Build/CesiumUnminified/Cesium.js"></script>
    <script src="../js/require.js"></script>
    <script src="./js/requireConfig.js"></script>
    <link rel="stylesheet" href="../js/Cesium/1.65/Build/Cesium/Widgets/widgets.css">
    <link rel="stylesheet" href="../css/common.css">

    <script>

        require([
            "uMap/uMap"
            , "uEarth/uEarth"
            , "mhjs/mhjs"
            , "App/UI/Layer"
        ], function (
            uMap
            , uEarth
            , mhjs
            , Layer
        ) {

            var earth = new uMap.Earth({
                objectOption: {
                    "container": "uMapApp_earthContainer"
                }
            });

            var debug = {};
            debug.transformPanel = new uMap.TransformPanel({
                "earth": earth,
                "title": "模型位置调整",
                "showClose": true,
                "showSubmit": true,
                "submitText": "复制变形参数到剪贴板"
            });

            debug.transformPanel.on("submit", function (panel) {
                uMap.Clipboard(panel.transform.value);
            });

            debug.transformPanel.hide();
            $("body").append(debug.transformPanel.dom);

            //地球设置
            earth.scene.globe.depthTestAgainstTerrain = true;
            earth.scene.postProcessStages.fxaa.enabled = false;

            //固定光照
            earth.clock.currentTime = uEarth.JulianDate.fromDate(new Date("2020/01/01 10:00:00"));
            earth.clock.clockRange = uEarth.ClockRange.CLAMPED;
            earth.clock.shouldAnimate = false;

            var globeImagery = new Layer({
                app: {
                    earth: earth
                },
                dataSource: {
                    "name": "GLOBE",
                    "title": "周边环境影像",
                    "type": "UrlTemplateImageryDataSource",
                    "url": "https://t{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}",
                    "subdomains": ["0", "1", "2", "3", "4", "5", "6", "7"],
                    "tilingScheme": "3857",
                    "token": {
                        "key": "tk",
                        "value": "6034bdc779b72e554e4a3ba66f558b1d"
                    },
                    "maxLevel": 17
                }
            });

            globeImagery.open();

            var overlayImagery = new Layer({
                app: {
                    earth: earth
                },
                dataSource: {
                    "name": "GLOBE_OVERLAY",
                    "title": "周边环境标注",
                    "type": "UrlTemplateImageryDataSource",
                    "url": "https://t{s}.tianditu.gov.cn/DataServer?T=cia_w&x={x}&y={y}&l={z}",
                    "subdomains": ["0", "1", "2", "3", "4", "5", "6", "7"],
                    "tilingScheme": "3857",
                    "token": {
                        "key": "tk",
                        "value": "6034bdc779b72e554e4a3ba66f558b1d"
                    },
                    "maxLevel": 17
                }
            });

            overlayImagery.open();

            var OPModelTileSet = new uMap.ObliquePhotographyModelPrimitive({
                objectOption: {
                    "url": "./data/whitehouse/tileset.json"
                },
                "transform": {
                    "position": {"longitude": 118.6136258733609, "latitude": 31.97037238187135, "height": 3},
                    "orientation": {"heading": 1.4986269549310858, "pitch": 0, "roll": -90}, "type": "local"
                }
            });

            OPModelTileSet.on("loaded", function (tileSet) {
                earth.camera.flyToBoundingSphere(
                    tileSet.boundingSphere
                );
                debug.transformPanel.transform = tileSet.transform;
                debug.transformPanel.show();
            });

            earth.scene.primitives.add(OPModelTileSet.object);


        });
    </script>

</head>
<body>
<div id="uMapApp_earthContainer" class="uMapApp_earthContainer"></div>
</body>
</html>